import React from 'react';
import { Space } from 'antd';
import { DownOutlined, UpOutlined } from '@ant-design/icons';

class MoreSearch extends React.Component {

  constructor(props) {
    super(props)
    this.state = {
      isExpand: false
    }
  }

  setExpand = () => {
    const { change } = this.props;
    const isExpand = this.state.isExpand;
    this.setState({ isExpand: !isExpand });
    change ? change(!isExpand) : null
  }

  render() {
    const children = this.props.children;
    const isExpand = this.state.isExpand;
    return (
      <Space>
        {children}
        <a style={{ fontSize: 12 }}
          onClick={this.setExpand}>
          {isExpand ? <div><UpOutlined />关闭</div> : <div><DownOutlined />展开</div>}
        </a>
      </Space>
    )
  }
}

export default MoreSearch